<!-- caoyong -->
<script src="/web/lib/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="/web/lib/BaseCyAxios.js"></script>
<script src="/web/public/public.js"></script>
<!--消息提示 -->
<script src="/web/lib/jquery.growl.js" type="text/javascript"></script>
<link href="/web/css/jquery.growl.css" rel="stylesheet" type="text/css"/>
<!--分页器 -->
<link rel="stylesheet" href="/web/css/pagination.css">
<script src="/web/lib/jquery.pagination.js"></script>
<div id="special-center-list">
    <div class="position">
        首页 - 专题
    </div>
    <div class="special-center-list_wrap">
        <div class="special-center-list_box"><!--20210115-->
            <ul id='id_special_ul'><!--20210115-->
                <!-- <ul id="id_special_ul">
                    <li>
                        <a href="#"><img src="/web/img/special-9box-img.png"></img></a>
                        <div class="special-9box_li_2">
                            <span class="special-9box_li_2_1">专题</span>
                            <a href="#"><span class="special-9box_li_2_2">31省政府集中采购目录空调电器购目录空调品目情况</span></div></a>
                        <div class="special-9box_li_3">
                            <span class="special-9box_li_3_1">2020-09-12</span>
                            <a href="#" class="special-9box_li_3_2">汽车</a>
                            <a href="#"><span class="special-9box_li_3_3">采购人</span></a>
                            <a href="#"><span class="special-9box_li_3_3">采购机构</span></a>
                            <ahref="#"><span class="special-9box_li_3_3">11113</span></a>
                        </div>
                    </li>
                </ul> -->
            </ul><!--20210115-->
        </div>
        <div class="M-box2_wrap">
            <div class="m-style M-box2"></div>
        </div>
    </div>
</div>
<script>
    $(function () {
        var $pagination = '';
        var $pageIndex = 1;
        var $pageSize = 9;
        $('.M-box2').pagination({
            current: $pageIndex,
            showData: $pageSize,
            coping: true,
            homePage: '',
            endPage: '',
            prevCls: 'prev',
            nextCls: 'next',
            activeCls: 'active',
            prevContent: '<上页',
            nextContent: '下页>',
            pageCount: 0,
            callback: function (api) {
                console.log(api.getCurrent(), api);
                $pageIndex = api.getCurrent();
                loadSpecialArticleList();
            }
        }, function (api) {
            $pagination = api;
            console.log($pagination, $pagination.getCurrent());
            // $pagination.setPageCount(80);
            // $pagination.filling($pageIndex);
        });


        //更新页面宫格数据
        var $id_special_ul = $('#id_special_ul')[0];
        // console.log($id_special_ul);
        var setUlByItem = function (items, ifClean) {
            var bufHtml = ""; // 声明一个空字符串容器
            for (var k of items) { // 循环遍历数组 拼接li标签部分和字符串内容
                bufHtml +=
                    // '            <ul id="id_special_ul">' +//20210115
                    '            <li>' +
                    '              <a href="' + k.articleUrl + '">' +
                    '                <img src="' + k.articleTitleImage + '" alt="' + k.articleTitleImageAlt + '"></img>' +
                    '              </a>' +
                    '              <div class="special-9box_li_2">' +
                    '                <span class="special-9box_li_2_1">专题</span>' +
                    '                <a href="' + k.articleUrl + '">' +
                    '                  <span class="special-9box_li_2_2">' + k.articleTitle + '</span>' +
                    '                </a>' +
                    '              </div>' +
                    '              <div class="special-9box_li_3">' +
                    '	             <span class="special-9box_li_3_1">' + k.updateTime.split(' ')[0] + '</span>' +
                    '	             <a  href="' + k.channelUrl + '" class="special-9box_li_3_2">' + k.channelName + '</a>' +
                    getSpanHtml(k.articleKeywordList) +
                    '              </div>' +
                    '            </li>';//20210115
                // '            </ul>';//20210115
            }

            if (ifClean) {
                $id_special_ul.innerHTML = bufHtml;
            } else {
                $id_special_ul.innerHTML = $id_special_ul.innerHTML + bufHtml;
            }


        }
        var getSpanHtml = function (item) {
            var bufHtml = '';
            // console.log('item',item);
            for (var k of item) {
                bufHtml +=
                    '            <a href="' + k.staticAddress + '">' +
                    '              <span class="special-9box_li_3_3">' + k.keyword + '</span>' +
                    '            </a>';
            }
            return bufHtml;

        }
        //联网获取一页数据
        var loadSpecialArticleList = function () {
            //联网操作
            var callback = function (status, obj) {
                console.log("status=" + status, obj);
                // console.log(obj);
                if (status == "ok") {
                    // noticeMsgShow(obj.message, 0); //0绿 1黄2红
                    $pagination.setPageCount(obj.data.pages);
                    $pagination.filling($pageIndex);
                    setUlByItem(obj.data.list, true);

                } else {
                    noticeMsgShow(obj.message, 2); //0绿 1黄2红
                }
            };
            var parameter = {
                page: $pageIndex,
                size: $pageSize,
            }
            myAjaxXf("front_article_loadSpecialArticleList", parameter, callback);
        }
        loadSpecialArticleList();

    });
</script>
